<template>
  <div>
    <el-container>
      <el-header style="background-color: blanchedalmond">Header</el-header>
      <el-container>
        <el-aside style="background-color: burlywood" width="200px">
          <!-- <template v-for="(e, i) in navs" :key="i">
            <router-link :to="e.path">{{ e.title }}</router-link>
          </template> -->
          <el-menu :router="true">
            <template v-for="(e, i) in navs" :key="i">
              <el-menu-item :index="e.path">{{ e.title }}</el-menu-item>
            </template>
          </el-menu>
        </el-aside>
        <el-main><router-view class="rv" /></el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script lang="ts">
/**
 * 页面核心数据结构体说明文档
 *
 *
 */
// import from
import { defineComponent } from "vue";

export default defineComponent({
  props: {
    sampleP: {
      type: Number,
      default: 0,
    },
  },
  data() {
    return {
      sampleD: "value",
      navs: [
        { path: "/home", title: "Home" },
        { path: "/about", title: "About" },
        { path: "/fst", title: "第一111页面" },
        { path: "/sec", title: "第二222页面" },
        { path: "/http", title: "HTTP页面" },
        { path: "/httpNew", title: "HTTPNEW" },
        { path: "/httpOld", title: "HTTPOLD" },
        { path: "/leaveApplier", title: "请假申请" },
        { path: "/leaveAuditor", title: "请假审核" },
      ],
    };
  },
  computed: {
    /* sampleC() {
      return this.sampleD + "--";
    }, */
  },
  created() {},
  mounted() {},
  methods: {
    // sampleM() {},
  },
  watch: {
    // sampleP(n, o) {},
  },
});
</script>
<style lang="scss">
.rv {
  // border: solid 2px red;
}

</style>
